import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { BasicService } from '../../../../@core/data/basic.service';
import { ServerDataSource } from 'ng2-smart-table';
// 消息提醒
import { ToasterConfig } from 'angular2-toaster';
import { NotificationsService } from '../../../../@core/utils/notifications.service';
// import { FroalaComponent } from '../../../../@theme/components/index';
import { PreviewqComponent } from '../../previewq/previewq.component';
const api = 'questions';
@Component({
  selector: 'ngx-question-modal',
  templateUrl: './question.modal.component.html',
})
export class QuestionModalComponent implements OnInit {

  @Input() modalHeader: string;
  @Input() isEdit: boolean;
  // isEdit = true 需要questionId去查询detail
  @Input() questionId: number;
  @Input() question: any;
  @Input() source: ServerDataSource;

  // @ViewChild('title')
  // private titleFroala: FroalaComponent;
  // @ViewChild('choiceA')
  // private choiceAFroala: FroalaComponent;
  // @ViewChild('choiceB')
  // private choiceBFroala: FroalaComponent;
  // @ViewChild('choiceC')
  // private choiceCFroala: FroalaComponent;
  // @ViewChild('choiceD')
  // private choiceDFroala: FroalaComponent;
  // @ViewChild('choiceE')
  // private choiceEFroala: FroalaComponent;
  // @ViewChild('choiceF')
  // private choiceFFroala: FroalaComponent;
  // @ViewChild('content')
  // private contentFroala: FroalaComponent;
  // @ViewChild('answer')
  // private answerFroala: FroalaComponent;
  // @ViewChild('analysis')
  // private analysisFroala: FroalaComponent;
  @ViewChild('previewq')
  private previewq: PreviewqComponent;

  questionType: any[];
  statusType: any[];
  courseType: any[];
  qbankType: any[];
  @Input() choiceHidden: boolean;
  previewHidden: boolean;

  constructor(private activeModal: NgbActiveModal, private basicService: BasicService, private notificationsService: NotificationsService) {
  }

  ngOnInit() {
    // 初始化下拉框的数据
    this.basicService.getOne('courses/findAll')
      .subscribe((data: any) => {
        this.courseType = data.rows;
      });
    this.basicService.getOne('qbanks/findAll')
      .subscribe((data: any) => {
        this.qbankType = data.rows;
      });
    this.basicService.getOne('configs/findByCtype?ctype=status_type')
      .subscribe((data: any) => {
        this.statusType = data.rows;
      });
    this.basicService.getOne('configs/findByCtype?ctype=question_type')
      .subscribe((data: any) => {
        this.questionType = data.rows;
      });
    if (this.isEdit) {
      this.getOne();
    }
  }

  getOne() {
    // this.titleFroala.content = this.question.title;
    // this.choiceAFroala.content = this.question.choiceA;
    // this.choiceBFroala.content = this.question.choiceB;
    // this.choiceCFroala.content = this.question.choiceC;
    // this.choiceDFroala.content = this.question.choiceD;
    // this.choiceEFroala.content = this.question.choiceE;
    // this.choiceFFroala.content = this.question.choiceF;
    // this.contentFroala.content = this.question.content;
    // this.answerFroala.content = this.question.answer;
    // this.analysisFroala.content = this.question.analysis;
  }

  // 取消
  closeModal() {
    this.activeModal.close();
  }

  // 保存
  saveData() {
    if (this.isEdit) {
      this.basicService.update(api, this.question).subscribe(
        data => {
          this.notificationsService.showToast('success', '操作', '<b>更新 <em>成功！</em></b>');
          this.activeModal.close();
          this.source.refresh();
        },
        err => {
          this.notificationsService.showToast('error', '操作', '<b>更新 <em>失败！</em></b>');
          console.error('Error saving!');
        },
      );
    } else {
      this.basicService.create(api, this.question).subscribe(
        data => {
          this.notificationsService.showToast('success', '操作', '<b>保存 <em>成功！</em></b>');
          this.activeModal.close();
          this.source.refresh();
        },
        err => {
          this.notificationsService.showToast('error', '操作', '<b>保存 <em>失败！</em></b>');
          console.error('Error saving!');
        },
      );
    }
  }

  /**
   * 试题预览
   */
  previewData() {
    this.previewHidden = true;
    this.previewq.question = this.question;
    this.previewq.choiceHidden = this.choiceHidden;
  }

  froalaContent(event) {
    if (event && event.length > 0 && event.indexOf('=') > 0) {
      const index = event.indexOf('=');
      const key = event.substring(0, index);
      const val = event.substring(index + 1);
      this.question[key] = val;
    }
  }

  /**
   * 试题类型变化时候触发事件
   * @param event
   */
  onQtypeChange(event) {
    const type = event.target.value;
    if (type === 'single_choice' || type === 'multiple_choice' || type === 'true_false') {
      this.choiceHidden = false;
    } else {
      this.choiceHidden = true;
    }
  }

  onCourseChange(event) {
    const courseId = event.target.value;
    this.basicService.getOne('qbanks/findByCourseId?courseId=' + courseId)
      .subscribe((data: any) => {
        this.qbankType = data.rows || [];
      });
  }

}
